import { reactive } from "vue"
import * as api from "@/api/users.js"
// 校验验证码
export const validateCapture = (rule, value, callback) => {
  if (value.length<5) {
    callback(new Error('验证码不能小于5位数'))
    
  } else {
    callback()
    // if()
    // 
  }
}
// 校验用户名
export const validateUsername = (rule, value, callback) => {
  let reg = /^[a-zA-Z0-9-_]{3,16}$/
  if (reg.test(value)) {
    callback()
  } else {
    callback(new Error('用户名必须由英文字母,数字,下划线或者短线3-16位'))
  }
}
// 校验密码
export const validatePassword = (rule, value, callback) => {
  if (value) {
    callback()
  } else {
    callback(new Error('密码不能为空'))
  }
}
// 校验手机验证码
export const validatecode = (rule, value, callback) => {
  if (value.length < 5) {
    callback(new Error('验证码不能小于5位数'))
  } else {
    callback()
  }
}
// 校验手机号
export const validatephonenum = (rule, value, callback) => {
  let reg = /^1[3456789]\d{9}$/
  if (reg.test(value)) {
    callback()
  } else {
    callback(new Error('请输入正确手机号'))
  }
}
// 常规校验规则
export const valirules = reactive({
  username: [{ validator: validateUsername, trigger: 'blur' }],
  password: [{ validator: validatePassword, trigger: 'blur' }],
  capture: [{ validator: validateCapture, trigger: 'blur' }],
})

// 短信校验规则
export const Smsrules = reactive({
  phonenum: [{ validator: validatephonenum, trigger: 'blur' }],
  identifyingcode: [{ validator: validatecode, trigger: 'blur' }],
})
/**
 * 
 * @param {Object} formEl 表单引用对象
 * @param {Function} successCallback 表单校验通过的回调函数
 * @param {Function} failCallback 表单校验失败的回调函数
 */
// 表单提交的时候
export const useSubmitForm = (successCallback, failCallback) => (formEl) => {
  if (!formEl) return
  // 调用了组件提供的校验方法
  formEl.validate((valid) => {
    // 如果所有的表单都校验通过,valid就是true,不然就是false
    if (valid) {
      // 登录请求可以在这里发送
      if (successCallback) {
        successCallback()
      }
      console.log('submit!')
    } else {
      console.log('error submit!')
      if (failCallback) {
        failCallback()
      }
      return false
    }
  })
}